class Cluster {
  constructor(map) {
    this.map = map;
  }
  clusterRender(options) {
    const {
      layer,
      clusterRadius,
      clusterMaxZoom,
      clusterRules,
      isSymbolText,
      symbolText,
      mapLayer,
      symbolLayer,
      noneClusterLayerOptions,
    } = options;
    const layers = [];
    // if (this.map.getLayer(sourceLayer + '_cluster') !== undefined) {
    //   return {
    //     status: 'error',
    //     message: '已存在该点图层的聚合图层，暂不支持对同一点图层添加多个聚合图层！'
    //   }
    // }

    const source = mapLayer.source;
    const dataSource = {
      type: 'geojson',
      data: source.url,
      cluster: true,
      clusterMaxZoom,
      clusterRadius,
    };
    // const clusterSourceId = `${source.sourceId}_cluster`
    // 如果不是第一次,需要先删除再添加
    // if (layer.renderType[1] === 'cluster') {
    //   this.map.removeSource(source.sourceId)
    // }
    this.map.addSource(source.sourceId, dataSource);
    mapLayer.source = source.sourceId;
    // Object.assign(mapLayer.source, {
    //   cluster: true,
    //   clusterMaxZoom: clusterMaxZoom,
    //   clusterRadius: clusterRadius
    // })
    // mapLayer.layerConfig.filter = ['has', 'point_count']
    // mapLayer.layerConfig.layout = {
    //   visibility: 'visible'
    // }
    const colorPaintArr = [];
    const radiusPaintArr = [];
    colorPaintArr.push('step', ['get', 'point_count']);
    radiusPaintArr.push('step', ['get', 'point_count']);
    // console.log(clusterRules);
    clusterRules.forEach((ruleItem) => {
      if (ruleItem.value === 'rule1') {
        colorPaintArr.push(ruleItem.color);
        radiusPaintArr.push(ruleItem.radius);
      } else {
        colorPaintArr.push(ruleItem.step, ruleItem.color);
        radiusPaintArr.push(ruleItem.step, ruleItem.radius);
      }
    });
    // console.log(colorPaintArr);
    // console.log(radiusPaintArr);
    mapLayer.paint = {
      'circle-color': colorPaintArr,
      'circle-radius': radiusPaintArr,
    };
    layers.push(mapLayer);
    if (isSymbolText) {
      symbolLayer.filter = ['has', 'point_count'];
      symbolLayer.name = `${layer.name}_clusterText`;
      symbolLayer.id = `${mapLayer.id}_clusterText`;
      const { layout, paint } = symbolText;
      symbolLayer.layout = layout;
      symbolLayer.paint = paint;
      symbolLayer.source = mapLayer.source;
      symbolLayer.type = 'symbol';
      symbolLayer.organizationType = 'singleLayer';
      layers.push(symbolLayer);
    }
    // noneClusterLayerOptions.source = mapLayer.id
    noneClusterLayerOptions.name = `${layer.name}_noneCluster`;
    noneClusterLayerOptions.organizationType = 'singleLayer';
    noneClusterLayerOptions.source = mapLayer.source;
    // noneClusterLayer = noneClusterLayerOptions
    layers.push(noneClusterLayerOptions);
    return {
      status: 'success',
      message: '成功',
      data: layers,
    };
  }
}
export default Cluster;
